<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
</head>
<body>
<div id="app">
    <div id="zh_log"></div>
</div>
</body>
<!-- 先引入 Vue -->
<script src="http://cdn.bootcss.com/vue/2.2.1/vue.min.js"></script>
<script>
    if (window.Notification) {
        setInterval(function () {
            var day = new Date().getDay();
            if (day == 0 || day == 6) {
                return;
            }

            var hour = new Date().getHours();
            if (hour < 9 || hour > 15) {
                return;
            }

            var req = new Request('sync', {method: 'GET', cache: 'reload'});
            fetch(req).then(
                    function(response) {
                        if (response.status !== 200) {
                            console.log('Status Code: ' + response.status);
                            return;
                        }
                        response.json().then(function(data) {
                            tips(data);
                        });
                    }
            ).catch(function(err) {
                console.log('Fetch Error: ' + err);
            });
        }, 60 * 1000);
    } else {
        alert('浏览器不支持Notification');
    }

    function tips(data) {
        if (data.length == 0) {
            return;
        }

        data.forEach(function(e){
            document.getElementById("zh_log").innerHTML = document.getElementById("zh_log").innerHTML + e;
        });

        var popNotice = function() {
            if (Notification.permission == "granted") {
                var notification = new Notification("Hi，小伍：", {
                    body: '你有一条未读消息',
                    icon: 'https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=751401234,866288515&fm=58'
                });

                notification.onclick = function() {
                    data.forEach(function(e){
                        window.open(e);
                    });
                    notification.close();
                };
            }
        };

        if (Notification.permission == "granted") {
            popNotice();
        } else if (Notification.permission != "denied") {
            Notification.requestPermission(function (permission) {
                popNotice();
            });
        }
    }
</script>
</html>